import Component from "../Component.js";
import Type from "../../experience/db/Type.js";

const Draw = ol.interaction.Draw;
const VectorSource = ol.source.Vector;

export default class WarningV2  extends Component {
    constructor() { super(); }

    async refresh() {
        const config = this.algo.getConfig();
        if (config == null) return

        const data = await this.api.getWarnings(config.meta_id);
        await this.db.refresh(Type.WarningV2, data.data);
        await this.drawer.draw(Type.WarningV2);
    }

    template() { }

    control() {
        const config = this.algo.getConfig();
        if (config == null) return

        // 从选择器接收发来的消息
        this.emitter.on("water-deleted", async () => {
            this.emitter.locked = true;
            const id = this.emitter.params[0];
            const dialog = this.app.dialog.confirm('确认将服务器的数据删除?', async () => {
                const config = this.algo.getConfig();
                const data = await this.api.delWarning({
                    id: id, meta_id: config.meta_id
                });

                if (data.code === 0) {
                    await this.db.refresh(Type.WarningV2, data.data);
                    await this.drawer.draw(Type.WarningV2);
                }

                this.emitter.emit("cancel-selected");
                this.emitter.locked = false;
            }, () => {
                this.emitter.emit("cancel-selected");
                this.emitter.locked = false;
                dialog.close();
            });
        });


        this.$$("#drawing-warning-area_v2").on("click", () => {
            const self = this;
            this.toast('请描画一个图形面,双击结束。');

            // 临时关闭选择器
            this.emitter.emit("prevent-slector")

            const source = new VectorSource();
            const draw = new Draw({ source: source, type: 'Polygon' });

            draw.on('drawend', async (event) => {
                this.drawer.locked = true
                const area = event.feature.getGeometry().flatCoordinates, points = [];
                for (let i = 0; i < area.length - 1; i = i + 2) {
                    const x = this.algo.denormalX(area[i]);
                    const y = this.algo.denormalY(area[i+1]);
                    points.push([x, y]);
                }

                const dialog = this.app.dialog.create({
                    title: "增加预警区域",
                    text: "点击选择预警区域类型？",
                    buttons: [
                        {
                            text: "预警区域",
                            onClick: async () => {
                                await this.api.addWarning({
                                    points: points,
                                    meta_id: config.meta_id,
                                    type: "warning"
                                });
                                this.drawer.removeInteraction(draw);
                                await this.refresh();
                                this.drawer.locked = false;
                                self.emitter.emit("restore-slector");
                            }
                        }, {
                            text: "报警区域",
                            onClick: async () => {
                                await this.api.addWarning({
                                    points: points, meta_id:
                                    config.meta_id,
                                    type: "alarm"
                                });
                                this.drawer.removeInteraction(draw);
                                await this.refresh();
                                this.drawer.locked = false;
                                self.emitter.emit("restore-slector");
                            }
                        }, {
                            text: "取消",
                            onClick: () => {
                                self.emitter.emit("restore-slector");
                                dialog.close();
                            }
                        },
                    ],
                    verticalButtons: false
                }).open();
            });

            this.drawer.addInteraction(draw);
        });
    }
}